import React, { Component } from "react";
import Barcode from "jsbarcode";

/**
 * 简单生成条形码
 */
class SimpleBarcode extends Component {
	componentDidMount() {
		this.createBarcode();
	}

	componentDidUpdate() {
		this.createBarcode();
	}

	createBarcode = () => {
		const { width = 1.5, height = 35, margin = 0, value, displayValue } = this.props;
		if (this.barcode && value) {
			Barcode(this.barcode, value, {
				displayValue, //是否在下面显示具体文字
				width, //线的宽度系数,1是正常,2是两倍,数越大越粗.
				height: displayValue ? height - 26 : height, // 条形码高度
				margin,
				textAlign: "left"
			});
		}
	};

	render() {
		const { className } = this.props;
		return (
			<div className={className}>
				<svg
					ref={ref => {
						this.barcode = ref;
					}}
				/>
			</div>
		);
	}
}

export default SimpleBarcode;
